<template>
  <!-- 发布群公告 -->
  <el-dialog
    :title="$t('chatMsg.announcement')"
    :visible.sync="dialogVisible"
    width="30%">
    <el-form :model="dataValue" status-icon :rules="rules" ref="dataValue" class="demo-ruleForm">
      <el-form-item prop="groupAnnouncement">
        <el-input
          type="textarea"
          :rows="10"
          maxlength="300"
          show-word-limit
          :placeholder="$t('chatMsg.keyUpContent')"
          v-model="dataValue.groupAnnouncement">
        </el-input>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible = false">{{$t('remindPop.cancel')}}</el-button>
      <el-button type="primary" @click="sendFunc('dataValue')">{{$t('remindPop.confirm')}}</el-button>
    </span>
  </el-dialog>
</template>

<script>
  export default {
    props: {
      itemVal: {
        type: Object,
        default: {}
      }
    },
    data () {
      return {
        dialogVisible: false,
        dataValue: {
          id: 220,
          groupAnnouncement: '',
          creatorUserId: 14
        },
        rules: {
          groupAnnouncement: [
            {required: true, message: this.$i18n.t('chatMsg.keyUpContent'), trigger: 'blur'}
          ]
        }
      }
    },

    methods: {
      inits () {
        this.dataValue.groupAnnouncement = ''
      },
      // 发公告
      sendFunc (dataValue) {
        this.$refs[dataValue].validate((valid) => {
          if (valid) {
            this.dataValue.id = this.itemVal.id
            this.dataValue.creatorUserId = this.itemVal.creatorUserId
            this.$http({
              url: this.$http.adornUrl('/admin/melt/group/publishAnnouncement'),
              method: 'post',
              data: this.dataValue
            }).then((data) => {
              this.pageLoading = false
              this.$message({
                message: this.$i18n.t('chatMsg.announcementSuccess'),
                type: 'success',
                duration: 1500,
                onClose: () => {
                  this.dataValue.groupAnnouncement = ''
                  this.dialogVisible = false
                }
              })
            })
          } else {

          }
        })
      }

    }
  }
</script>

<style>
</style>
